<template>
  <div class="page5 wow" style="visibility: visible">
    <h2>
      <span>国家二级</span>
      施工资质
      <br />
      水电隐蔽工程终身免费保修
    </h2>
    <ul>
      <li>
        <div><span data-v-c3ec5b76=""><numberScroll :value="300"></numberScroll></span> <b>+</b></div>
        <p>在建工地</p>
      </li>
      <li>
        <div><span data-v-c3ec5b76=""><numberScroll :value="60"></numberScroll></span> <b>道</b></div>
        <p>施工工艺</p>
      </li>
      <li>
        <div><span data-v-c3ec5b76=""><numberScroll :value="31"></numberScroll></span> <b>步</b></div>
        <p>施工流程</p>
      </li>
      <li>
        <div><span data-v-c3ec5b76=""><numberScroll :value="40"></numberScroll></span> <b>+</b></div>
        <p>金牌项目经理</p>
      </li>
      <li>
        <div><span data-v-c3ec5b76=""><numberScroll :value="136"></numberScroll></span> <b>项</b></div>
        <p>工地管理条例</p>
      </li>
      <li>
        <div><span data-v-c3ec5b76=""><numberScroll :value="6"></numberScroll></span> <b>大</b></div>
        <p>验收环节</p>
      </li>
    </ul>
    <div class="content">
      <div class="con_box">
        <h4>01</h4>
        <h3>墙面抗裂</h3>
        <h3>找平找方系统</h3>
        <ul>
          <li>增强墙体粘接力，避免空鼓，脱层</li>
          <li>增强防裂网格布，杜绝开裂隐患</li>
          <li>31mm精钢护角，延长墙体使用寿命</li>
          <li>耐水腻子，底漆、墙面防潮耐碱能力高</li>
          <li>平整度误差≤2mm</li>
        </ul>
        <div class="nalr">
          <p @click="show">立即咨询</p>
          <p>参观工地</p>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup>
const emits = defineEmits('show-event');
const show = ()=>{
  emits('show-event',true);
}

</script>

<style>
.home .page5 {
  opacity: 0;
  animation: slide-down-in 1s, fade-in 1s;
  animation-fill-mode: forwards;
}
.home .page5 > h2 {
  padding: 1rem 0.29rem 0;
}
.home .page5 > ul {
  padding: 1rem 0.29rem 0;
}
.home .page5 > h2 {
  font-size: 0.56rem;
  font-weight: 700;
  line-height: 1.1;
  color: #000;
  margin-bottom: 0.59rem;
}

.home .page5 > h2 span {
  color: #dd292c;
}

.home .page5 > ul {
  display: flex;
  flex-wrap: wrap;
}

.home .page5 > ul li {
  margin-bottom: 0.35rem;
  width: 33.33%;
}

.home .page5 > ul li div {
  line-height: 1;
  display: flex;
  align-items: flex-end;
}

.home .page5 > ul li div span {
  font-size: 0.66rem;
  font-family: Gilroy-Bold;
  font-weight: 700;
  color: #dd292c;
  line-height: 1;
  display: inline-block;
}

.home .page5 > ul li div b {
  font-size: 0.24rem;
  font-weight: 700;
  color: #000;
  transform: translateY(-0.1rem);
  margin-left: 0.08rem;
}

.home .page5 > ul li p {
  font-size: 0.22rem;
  font-weight: 400;
  color: #666;
  line-height: 1;
  margin-top: 0.06rem;
}

.home .page5 .content {
  margin-top: 0.95rem;
  background: url(/src/assets/img/p5_bj.jpg) no-repeat;
  background-size: 100% 100%;
  padding: 0.5rem 1rem 0.5rem 0.5rem;
}
.home .page5 .content .con_box {
  padding: 0.5rem;
  background: #fff;
}
.home .page5 .content .con_box h4 {
  color: #999;
  font-size: 0.46rem;
  font-weight: 700;
}
.home .page5 .content .con_box h3 {
  font-size: 0.56rem;
}
.home .page5 .content .con_box ul {
  margin-top: 0.5rem;
}
.home .page5 .content .con_box ul li {
  margin-top: 0.15rem;
  font-size: 0.3rem;
  color: #999;
  display: flex;
  align-items: center;
}
.home .page5 .content .con_box ul li::before {
  content: '';
  display: block;
  width: 0.12rem;
  height: 0.12rem;
  background: #dd292c;
  border-radius: 50%;
  margin-right: 0.1rem;
}
.home .page5 .nalr {
  display: flex;
  font-size: 0.3rem;
  margin-top: 0.3rem;
}
.home .page5 .nalr p {
  padding: 0.2rem 0.3rem;
  border-radius: 0.1rem;
}
.home .page5 .nalr p:first-child {
  background: #dd292c;
  margin-right: 0.4rem;
  color: #fff;
}
.home .page5 .nalr p:nth-child(2) {
  border: 1px solid #dd292c;
  color: #dd292c;
}
</style>